<template>
  <view class="padding"
        style="display: flex;flex-direction: column;">
    <view @click="$emit('click',$event)"
               v-if="lineWhite"
               class="cu-btn round line-white lg">{{ label }}</view>
    <button v-else
            @click="$emit('click',$event)"
            class="cu-btn bg-blue-trans round lg">{{ label }}</button>
  </view>
</template>

<script>
export default {
  props: {
    label: {
      type: String,
      default: () => ''
    },
    lineWhite: {
      type: Boolean,
      default: false
    }
  }
};
</script>

<style lang="less">
.padding {
  padding: 8px;
}
.cu-btn.lg {
  padding: 0 19px;
  font-size: 15px;
  height: 38px;
}
.bg-blue-trans {
  background-color: hsla(0, 0%, 100%, 0.2);
  color: #fff;
  font-size: 17px;
}
.cu-btn {
  position: relative;
  border: 0px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0 16px;
  font-size: 15px;
  height: 35px;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  overflow: visible;
  margin-left: 0;
  transform: translate(0px, 0px);
  margin-right: 0;
}
.line-white,
.lines-white,
.text-white {
  color: #fff;
}
.margin-tb {
  margin-top: 14px;
  margin-bottom: 14px;
}
</style>
